<template>
  <view class="notice">
    <view class="main" v-for="(item,index) in  main " :key="index" @click="toDetail(item.id)">
      <view class="tit">
        <view class="title"> {{item.title}} </view>
        <view class="time"> {{item.createtime}} </view>
      </view>
      <view class="img">
        <image :src="item.image"></image>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        main: []
      };
    },
    onShow() {
      this.list()
      uni.setNavigationBarTitle({
        title: "公告"
      })
    },
    methods: {
      list() {
        let that = this;
        that.$http('common.notice', {}).then(res => {
          this.main = res.data
          console.log(this.main, "+++++++++++")
        });
      },
      // 跳转详情
      toDetail(id) {
        this.$Router.push(`/pages/public/tip/detail?id=${id}&type=3`)
      }
    }
  };
</script>

<style lang="scss" scoped>
  .notice {
    background: white;
    height: 100%;

    .name {
      background: white;
      box-shadow: 20rpx 0rpx 14rpx 10rpx #F0F0F0;
      text-align: center;
      position: relative;
      overflow: hidden;
      padding: 36rpx 0;
      // color: white;
      font-weight: bold;
      font-size: 30rpx;

      image {
        width: 39rpx;
        height: 39rpx;
        position: absolute;
        left: 30rpx;
      }
    }

    .main {
      margin-top: 20rpx;
      background: white;
      border-bottom: 1px solid #EFEFEF;
      padding: 15rpx 18rpx;
      display: flex;
      justify-content: space-between;
      .tit {
        view {
          padding: 15rpx 70rpx;
        }

        .title {
          font-weight: bold;
        }

        .time {
          font-size: 20rpx;
          color: #999999;
        }
      }
      .img{
        width: 20%;
        margin-right: 40rpx;
        image{
          width: 100%;
          height: 100%;
        }
      }
    }
  }
</style>
